<template>
	<view class="container">
		<view class="container-top">
			<view class="header">
				<view class="title">{{formData.create_time}}交易账款</view>
				<view class="price">
					<view class="symbol">￥</view>
					<view class="withPrice">{{formData.balance}}</view>
				</view>
				<view class="stutas" v-if="formData.with_status == 'SUCCESS'">提现成功</view>
				<view class="stutas" v-if="formData.with_status == 'FAIL'" style="color: greenyellow;">提现失败</view>
				<view class="stutas" v-if="formData.with_status == 'PROCESSING'" style="color: greenyellow;">处理中</view>
				<view class="stutas" v-if="formData.with_status == 'REEXCHANGE'" style="color: greenyellow;">退票</view>
				<view class="stutas"
					v-if="formData.with_status == null || formData.with_status == '' || formData.with_status == 'NOT_FOUND'"
					style="color: red;">未提现</view>
			</view>
			<view class="content">
				<view class="left">
					<view class="left-text">收款门店</view>
					<view class="left-text">提现单号</view>
					<view class="left-text">抖音提现单号</view>
					<view class="left-text">提现发起时间</view>
					<view class="left-text">提现完成时间</view>
					<view class="left-text">提现金额</view>
				</view>
				<view class="right">
					<view class="right-text">{{nickname}}</view>
					<view class="right-text" v-if="formData.with_status == 'SUCCESS'">{{formData.with_no}}</view>
					<view class="right-text" v-else>无单号</view>
					<view class="right-text" v-if="formData.with_status == 'SUCCESS'">{{formData.dy_with_no}}</view>
					<view class="right-text" v-else>无单号</view>
					<view class="right-text" v-if="formData.with_status == 'SUCCESS'">{{formData.create_time}}</view>
					<view class="right-text" v-else>无日期</view>
					<view class="right-text" v-if="formData.with_status == 'SUCCESS'">{{formData.with_time}}</view>
					<view class="right-text" v-else>无日期</view>
					<view class="right-text">￥{{formData.balance}}</view>
				</view>
			</view>
		</view>
		<view class="footer" @click="goFlow(formData.create_time)">
			<view class="footer-text">当日分账记录</view>
			<uni-icons type="right" color="#bfbcbf" size="16" style="margin-right: 30rpx;"></uni-icons>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				formData: {},
				nickname: ''
			}
		},
		methods: {
			goFlow(time) {
				uni.navigateTo({
					url: `/pages/home/flowDetails/flowDetails?time=${time}`
				})
			}
		},
		onLoad(option) {
			this.formData = JSON.parse(decodeURIComponent(option.item))
			console.log(this.formData);
			var userInfo = uni.getStorageSync("adminInfo")
			this.nickname = userInfo.nickname
		}
	}
</script>
<style>
	page {
		background-color: #f7f7f7;
	}
</style>
<style lang="scss" scoped>
	.container {
		background-color: #f7f7f7;

		.container-top {
			padding: 15rpx;
			background-color: #fff;

			.header {
				display: flex;
				flex-direction: column;
				align-items: center;

				.title {
					font-size: 34rpx;
					font-weight: 600;
					color: #000;
				}

				.price {
					display: flex;
					align-items: flex-end;
					margin-top: 20rpx;

					.symbol {}

					.withPrice {
						font-size: 50rpx;
						font-weight: 700;
						color: #000;
					}
				}

				.stutas {
					font-size: 26rpx;
					color: #8d8b8d;
					margin-top: 40rpx;
				}
			}

			.content {
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-top: 40rpx;
				padding: 20rpx;

				.left {
					.left-text {
						font-size: 30rpx;
						color: #b0adb0;
						margin-top: 20rpx;
					}
				}

				.right {
					display: flex;
					flex-direction: column;
					align-items: flex-end;

					.right-text {
						font-size: 30rpx;
						color: #232123;
						margin-top: 20rpx;
					}
				}
			}
		}

		.footer {
			width: 100%;
			height: 100rpx;
			background-color: #fff;
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 30rpx;

			.footer-text {
				font-size: 30rpx;
				font-weight: 600;
				color: #000;
				margin-left: 30rpx;
			}
		}
	}
</style>